<script setup>
import { store } from '../store';
import { storeToRefs } from 'pinia';
const mystore=store();
const {productList}=storeToRefs(mystore);//数据解构
mystore.getProductList();//给productList赋值
const addToShoppingCar=item=>{
    mystore.addToShoppingCar(item)
}
</script>

<template>
商品列表
<el-table :data="productList" border style="width: 100%">
    <el-table-column prop="pid" label="商品编号" width="180" />
    <el-table-column label="商品图片" >
        <template v-slot="scope">
            <el-avatar shape="square" :size="50" :fit="fit" :src="scope.row.photo" />
        </template>
        </el-table-column>
    <el-table-column prop="title" label="商品名称" width="180" />
    <el-table-column #default="scope" label="商品单价">
        <el-tag type="warning">￥{{scope.row.price}}元/单位</el-tag>
    </el-table-column>
    <el-table-column prop="number" label="商品库存" />
    <el-table-column  label="操作" >
        <template #default="scope">
            <el-button type="danger" title="Add To ShoppingCar" @click="addToShoppingCar(scope.row)">添加到购物车</el-button>
        </template>
        </el-table-column>
  </el-table>
</template>

<style scoped>

</style>
